.container {
  margin-bottom: 64px;
  overflow-x: hidden;
  overflow-y: scroll;
    .product-info {
    display: grid;
    align-items: center;
    grid-template-columns: 100%;
    grid-template-rows: 1fr 1fr 1fr 1fr;
    grid-template-areas:
      'base-price'
      'tag'
      'product-name'
      'service-desc';
      padding: .5rem;
    .base-price {
      grid-area: base-price;
      display: flex;
      justify-content: space-between;
      align-items: center;
      i {
        color: red;
        font-weight: 600;
        font-style: normal;
      }
      span {
        font-size: 30px;
        color: red;
        font-weight: 600;
      }
      del {
        margin-left: .2rem;
        color: #58595b;
      }
    }
    .tag {
      position: relative;
      grid-area: tag;
      padding: .5rem 0;
      border-bottom: 1px solid #e2ecf7;
      span {
        padding: 0 .1rem;
        border: 1px solid red;
        color: red;
        margin: .2rem;
        font-size: 14px;
      }
    }
    .product-name {
      place-items: center;
      grid-area: product-name;
      .name_prefix {
        background-color: red;
        color: #fff;
        font-size: .8rem;
        font-weight: 600;
        padding: .1rem .2rem;
        border-radius: 5px;
        margin-right: 3px;
        letter-spacing: 2px;
      }
      span {
        font-size: 1.1rem;
        font-weight: 600;
      }
    }
    .service-desc {
      position: relative;
      grid-area: service-desc;
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      justify-content: flex-start;
      padding: .3rem 0;
      border-bottom: 1px solid #e2ecf7;
      .desc-info {
        flex-shrink: 0;
        padding: .2rem 0;
        margin-left: .7rem;
        &:first-child {
          margin-left: 0;
        }
        .spot {
          display: inline-block;
          width: .18rem;
          height: .18rem;
          background-color: #58595b;
          border-radius: 50%;
          margin-right: .8rem;
          vertical-align: middle;
        }
        span {
          color: #58595b;
          font-size: 14px;
        }
      }
    }

    .tag ,
    .service-desc {
      &::after {
        content: '\e606';
        font-family: 'iconfont';
        position: absolute;
        right: 0;
        color: #e2ecf7;
        top: 50%;
        transform: translateY(-50%);
      }
    }
  }

}

